<template>
    <div>
        <!-- {{ this.$store.state.num }}=={{ getnum }}=={{ this.$store.getters.firtName }}=={{ firtName }}
        <hr>
        <button @click="ck">相加的和{{ this.$store.state.sum }}</button>
        <hr> -->
        <h1>当前求和为:{{ $store.state.sum }}</h1>
        <br />
        <select name="" v-model.number="values">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
        <button @click="add">+</button>
        <button @click="subtract">-</button>
        <button @click="jia(1)">当前求和为奇数再加</button>
        <!-- <button @click="jia(2)">当前求和为偶数再加</button> -->
        <button @click="set">等一等再加1</button>
        <hr>
        <h1>小仓库数据</h1>
        {{ $store.state.one.object }}=={{ $store.getters['one/changeObject'] }}
        <button @click="onechange">点击修改</button>
        <button @click="onechangechinaese">等一等再出来</button>
    </div>
</template>

<script>
import { mapGetters, mapState } from 'vuex'
export default {
    data() {
        return {
            values: 1
        }
    },
    created() {
        console.log(this.$store.getters.firtName);
        console.log(this.$store.getters['one/changeObject']);
    },
    computed: {
        ...mapState({
            getnum: (state) => {
                return state.num + 4
            }
        }),
        ...mapGetters(['firtName'])
    },
    methods: {
        ck() {
            // this.$store.state.sum++
            // 只能传一个参数位，如果要传多个就要写成数组或者对象
            this.$store.commit('changeSum', 1)
        },
        // 加
        add() {
            // 只能传一个参数位，如果要传多个，写成数组或者对象
            this.$store.commit("changeSum", Number(this.values));
        },
        // 减
        subtract() {
            this.$store.commit("changeSum1", Number(this.values));
        },
        // 求和在加
        jia() {
            if (this.$store.state.sum % 2 == 1) {
                this.$store.dispatch('even', 1)
            }else{
                return
            }
            // if (this.$store.state.sum % 2 == 0 && value == 2) {
            //     this.$store.dispatch('even', value)
            // } else if (this.$store.state.sum % 2 == 1 && value == 1) {
            //     this.$store.dispatch('even', value)
            // }
        },
        // 等等再加
        set() {
            // setTimeout(() => {
            //     this.$store.commit("changeSum", Number(this.values));
            // }, 1000);

            this.$store.dispatch('wait', 1)
        },
        onechange(){
            this.$store.commit('one/changemath')
            // location.reload()
            this.$forceUpdate()
        },
        onechangechinaese(){
            this.$store.dispatch('one/changechinaese','刘子')
            this.$forceUpdate()
        }
    }
}
</script>

<style lang="less" scoped>
div>select:nth-child(3) {
    width: 40px;
    height: 30px;
    font-size: 20px;
    margin-left: 5px;
}

div>button:nth-child(4) {
    width: 30px;
    height: 30px;
    font-size: 20px;
    margin-left: 5px;
}

div>button:nth-child(5) {
    width: 30px;
    height: 30px;
    font-size: 20px;
    margin-left: 5px;
}

div>button:nth-child(6) {
    font-size: 20px;
    margin-left: 5px;
}

div>button:nth-child(7) {
    font-size: 20px;
    margin-left: 5px;
}

div>button:nth-child(8) {
    font-size: 20px;
    margin-left: 5px;
}
</style>